<template>
    <div style="height: 100vh; display: flex; align-items: center; justify-content: center; background-color: #669fef">
        <div style="display: flex; background-color: white; width: 50%; border-radius: 5px; overflow: hidden">
            <div style="flex: 1">
                <img src="@/assets/register.png" alt="" style="width: 100%">
            </div>
            <div style="flex: 1; display: flex; align-items: center; justify-content: center">
                <el-form :model="ruser" style="width: 80%" :rules="rules">
                    <div style="font-size: 20px; font-weight: bold; text-align: center; margin-bottom: 20px">
                        欢迎注册阿达西管理系统
                    </div>
                    <el-form-item prop="username">
                        <el-input size="medium" placeholder="请输入账号" v-model="username"></el-input>
                    </el-form-item>
                    <el-form-item prop="password">
                        <el-input size="medium" placeholder="请输入密码" v-model="password"></el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="info" style="width: 100%" @click="register">注 册</el-button>
                    </el-form-item>
                    <div style="display: flex">
                        <div style="flex: 1">已经有账号了？请 <span style="color: #6e77f2; cursor: pointer"
                                @click="$router.push('/login')">登录</span></div>
                    </div>
                </el-form>
            </div>
        </div>
    </div>
</template>
  
<script>
import { ref } from 'vue';
import request from "@/utils/request";
import router from "../router";

export default {
    setup() {
        const ruser = ref({
            username: '',
            password: '',
        });



        const register = () => {


        };

    return {
      ruser,
      rules: {
        username: [{ required: true, message: '请输入账号', trigger: 'blur' }],
        password: [{ required: true, message: '请输入密码', trigger: 'blur' }],
      },
      register,
    };


    },
};
</script>
  
<style scoped></style>